<template>
  <div>
    <p>{{ age }}</p>
    <p>{{ username }}</p>
    <button @click="updateAge(1989)">修改age</button>
    <button @click="updateAgeAfter1s(1213)">异步函数修改age</button>
    <hr />
    <!-- <button @click="$store.getters.jisuanage">age相加</button> -->
    <p>{{ jisuanage }}</p>
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'
export default {
  computed: {
    ...mapState('cart', ['age', 'username']),
    ...mapGetters('cart', ['jisuanage'])
  },
  methods: {
    ...mapMutations('cart', ['updateAge']),
    ...mapActions('cart', ['updateAgeAfter1s'])
  }
}
</script>

<style></style>
